[CKEDITOR] 스크립트에서 DOM 추가 후 replace() 적용하는 방법은?

만약 CKEDITOR에서 생성될 에디터가 노출되지 않고 다른 곳으로 이전하게 하려면 어떻게 해야하는지 알아봅니다.


(참고로 현재는 이 방법을 궂이 사용하지 않아도 될 수 있습니다.)
이를 해결하기 위해서 자바스크립트에서 textarea 엘리먼트를 생성하여 변수에 적용 후 CKEDITOR의 replace()를 적용한 뒤에 화면에 보여주게 하려는 경우의 방법입니다. 아래의 코드를 봐주세요.

위 코드를 보면 먼저 textarea 태그를 editor 이름의 변수로 생성 후 저장합니다. 그리고 body 태그에 추가한 뒤 CKEDITOR의 replace()를 사용하여 해당 위치로 이동하는 방법입니다. 이를 위해 CKEDITOR.replace(이동할 위치)를 적용하였죠.


참고로 위와 같은 방법으로 미리 CKEDITOR의 인스턴스는 생성할 수 있으나 이를 다시 다른 위치로 옮기려고 할 경우 문제가 발생할 수 있습니다. 여러가지 테스트 해본 결과 CKEDITOR의 인스턴스와 함께 생성된 이벤트가 정상적으로 다른 엘리먼트에 이동되지 못하는 문제점이 있으니 참고바랍니다.

처음부터 원하는 위치에 엘리먼트를 위치 시킨 후 CKEDITOR.replace() 함수를 사용하는 것이 좋습니다.